<template>
  <div class="layout">
    <router-view />
    
    <van-tabbar v-model="active" route>
      <van-tabbar-item icon="home-o" to="/">首页</van-tabbar-item>
      <van-tabbar-item icon="search" to="/search">搜索</van-tabbar-item>
      <van-tabbar-item icon="manager-o" to="/teachers">讲师</van-tabbar-item>
      <van-tabbar-item icon="user-o" to="/profile">我的</van-tabbar-item>
    </van-tabbar>
  </div>
</template>

<script setup lang="ts">
import { ref } from 'vue';

const active = ref(0);
</script>

<style scoped>
.layout {
  padding-bottom: 50px;
  min-height: 100vh;
  background: #f8f8f8;
}
</style>
